<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"  %>
<!DOCTYPE html>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path + "/";
%> 
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=9">
        <link rel="stylesheet" href="<%=basePath %>css/cssreset.css">
        <link rel="stylesheet" href="<%=basePath %>css/setupgroups.css">
        <link rel="stylesheet" href="<%=basePath %>css/daohang.css">
        <script src="<%=basePath %>js/jquery-1.11.1.min.js"></script>
        <script src="<%=basePath %>js/menu.js"></script>
    </head>
    <style>
    .zcd>a{
		color:#7896b7;
		text-decoration: none;
		cursor:pointer;
	}
	.psxa>a{
			text-decoration:none;
			color:#708dac;
		}
	.psxa{
			color:#708dac;
			width:100%;
			line-height:23px;
			text-align: center;
			margin-top:27px;
			font-family: '微软雅黑';
			cursor:pointer;
			font-size:16px;
		}
		.ims{
			position:relative;
			top:4px;
			right:22px;
		}
    </style>
    <body>
    	<div class="headers">
    		<p class="pa">客户管理系统CRM</p>
    		<p class="rights">
	    		<img src="<%=basePath %>images/user.png" alt="">
	    		${staff.staff_name}
	    		<button onclick="ind()"></button>
    		</p>
    	</div>
    	<section>
    		<ol class="lefts">
    			<li class="pb">
    				<img src="<%=basePath %>images/Users and permissions.png" alt="">
    				用户和权限
    				<img src="<%=basePath %>images/button (2).png" alt="">
    				<div class="div1" style="display:block;">
    					<p class="zcd" id="zcd1"><a href="<%=basePath %>role/page.action" style="color:#fff">角色管理</a></p>
						<p class="zcd" id="zcd2"><a href="<%=basePath %>staff/selectTree.action">部门/用户管理</a></p>
    				</div>
    			</li>
    			<li class="px">
    				<img src="<%=basePath %>images/canshu.png" alt="">
    				业务参数和设定
    				<img src="<%=basePath %>images/button (2).png" alt="">
    				<div class="div1">
    					<%-- <p class="zcd" id="zcd1" name="ppa"><a href="<%=basePath %>tradeManage/select.action">行业管理</a></p>
                        <p class="zcd" id="zcd2" name="ppa"><a href="<%=basePath %>compactGenre/select.action">合同类型</a></p>
                        <p class="zcd" id="zcd1" name="ppa"><a href="<%=basePath %>rank/select.action">客户级别</a></p>--%>
                        <p class="zcd" id="zcd2" name="ppa"><a href="<%=basePath %>rank/select.action">申请性质</a></p> 
                        <p class="zcd" id="zcd2" name="ppa"><a href="<%=basePath %>salestage/select.action">产品类别</a></p>
                        <p class="zcd" id="zcd2" name="ppa"><a href="<%=basePath %>record/select.action">来源渠道</a></p>
    				</div>
    			</li>
                <li class="py">
                    <img src="<%=basePath %>images/liucheng.png" />
                    	流程管理
                    <img src="<%=basePath %>images/button (2).png" />
                    <div class="div1">
                        <p class="zcd" id="zcd1"><a href="<%=basePath %>approveRole/select.action">审批流程管理</a></p>
                        <p class="zcd" id="zcd1"><a href="<%=basePath%>approve/count.action?pageSize=2" >已审批流程查看</a></p>
                    </div>
                </li>
                <li class="pxa">
                    <img src="../images/gonggao.png" alt="" width="18px">
                    <a href="../html/gongao.html" style="color:#708dac;text-decoration: none;">公告管理&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
                </li>
                 <li class="pxaa">
                    <img src="../images/kehu (1).png" alt="">
                    		资源开发
                    <img src="../images/button (2).png" alt="">
                    <div class="div1">
                        <p class="zcd" id="zcd1"><a href="<%=basePath %>client/weifencount.action?zhuizong=0">用户开发</a></p>
                        <p class="zcd" id="zcd2"><a href="../client/findByAllForAgent.action?start=1">代理开发</a></p>
                    </div>
                </li> 
                 <%-- <li class="pxas">
    				<img src="../images/kehuzilao.png" alt="">
    				客户资料
    				<img src="../images/button (2).png" alt="">
    				<div class="div1" >
    					<p class="zcd" id="zcd1"><a href="<%=basePath%>client/findByAllData.action?start=1">用户资料</a></p>
						<p class="zcd" id="zcd2"><a href="<%=basePath%>client/findByAllData.action">代理资料</a></p>
    				</div>
    			</li> --%>
    			<li class="psxa">
    				<img src="../images/operation-management.png" alt="" width="16px" class="ims">
    				<a href="<%=basePath %>Operate/count1.action">运营管理&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
    			</li>
    		</ol>
    		<div class="righta">
    			<div class="lefta">
    				<div class="but"><button>添加新角色</button></div>
    				<div class="bottoma">
    					<ul>
    						<c:forEach items="${roles}" var="role">
    							<li onclick="roleById(${role.role_id},${role.role_jurisdictionId})">
		    						${ role.role_name}
		    						<c:if test="${role.role_id != 1}" >
			    						<span class="oli">
			    							<img src="<%=basePath %>images/edit.png" alt="" class="imga" onclick="updatePage(${role.role_id})" >
		    								<img src="<%=basePath %>images/delete.png" alt="" class="imgb" onclick="deleteById(${role.role_id})">
			    						</span>
		    						</c:if>
	    						</li>
    						</c:forEach>
    					</ul>
    				</div>
    			</div>
    			<div class="rightb">
    				<p class="pc" ></p>
    				<p class="pc">数据权限</p>
    				<p class="pd">请设置该角色的数据权限(包括:读取、修改、删除、转移)</p>
					
					<c:forEach items="${ jurisdictions}" var="jurisdictions">
						<div class="pe">
							<input type="radio" name="qianxian" value="${jurisdictions.jurisdiction_id }" class="jurisdiction" id="jurisdiction${jurisdictions.jurisdiction_id}" onclick="updateJurisIdHtml(${jurisdictions.jurisdiction_id})"> ${jurisdictions.jurisdiction_name}
						</div>
					</c:forEach>
					
					<button class="buta" onclick="updateRole()">保存</button>
    			</div>
    		</div>
    	</section>
    	<footer>
    		<p class="topa">&nbsp;&nbsp;&nbsp;&nbsp;新建角色<span><img src="<%=basePath %>images/guanbi.png" alt=""></span></p>
    		<div>
    			<div class="topb"><span class="spans">名称&nbsp;:</span><input type="text" id="role_newName">&nbsp;&nbsp;&nbsp;&nbsp;<span class="spanx">*</span></div>
    			<div class="bottomb"><span>描述&nbsp;:</span><input type="text" id="role_remarks"></div>
    			<div class="centers"><input type="submit" class="submit" value="新增" onclick="saveRole()"></div>
    		</div>
    	</footer>
    	<div class="footers">
    		<p class="topa">&nbsp;&nbsp;&nbsp;&nbsp;编辑角色<span><img src="<%=basePath %>images/guanbi.png" alt=""></span></p>
    			<div class="topb"><span class="spans">名称&nbsp;:</span><input type="text" value="" id="detailsName">&nbsp;&nbsp;&nbsp;&nbsp;<span class="spanx">*</span></div>
    			<div class="bottomb"><span>描述&nbsp;:</span><input type="text" id="role_remarksa"></div>
    			<div class="centers"><input type="submit" class="submit" value="修改" onclick="updateRoles()"></div>
    	</div>
    	<div class="smalls"></div>    	
    	<p id="role_name"></p>
    	<p id="jurisdiction_id"></p>
    </body>
    <script>
    function ind(){
    	window.location.href= "../notice/findByAll.action";
    }
    	$('ul li').click(function() {
    		$(this).css('background', '#bac5d0');
    		$('.oli').css('display','block');
    		$(this).siblings('').children('.oli').css('display', 'none');
    	}, function() {
    		$(this).css('background', 'none');
    		$('.oli').css('display','none');
    	});
    	$('ul li').click(function(event) {
    		$(this).css('background', '#bac5d0');
    		$(this).siblings('').css('background', 'none');
    		$('.oli').css('display','inline');
    		$(this).siblings('').children('.oli').css('display', 'none');
    	});
    	$('.rightb>div').click(function(event) {
    		$(this).css('border-color', '#3dc444').siblings('').css('border-color', '#999');
    		$('.divc').css('display', 'block');
    		$('.divb').css('border-color', '#3dc444');
    		$(this).siblings('').children('').css('border-color', '#999');
    		$(this).siblings('').children('').children('.divc').css('display', 'none');
    	});
    	$('.but>button').click(function(event) {
    		$('footer').css('display', 'block');
    		$('.smalls').css('display','block');
    	});
    	$('.topa>span').click(function(event) {
    		$('footer').css('display', 'none');
    		$('body').css('baclground', 'none');
    		$('.smalls').css('display','none');
    		$('.footers').css('display', 'none');
    	});
    	$('.imga').click(function(event) {
    		$('.footers').css('display', 'block');
    		$('.smalls').css('display','block');
    	});
    	$('.xiangqi>p>img:nth-of-type(1)').click(function(event) {
    		$('.xiangqi>p>input').css('border', '1px solid #ddd');
    		$(this).parent().siblings('').children('input').css('border', 'none');
    		$(this).siblings('input').removeAttr('disabled');
    		$(this).parent().siblings('').children('input').attr('disabled', 'disabled');
    		$(this).attr('src', '<%=basePath %>images/queding.png');
    		$(this).parent().siblings('').children('.xiangqi>p>img:nth-of-type(1)').attr('src', '<%=basePath %>images/edit.png');
    	});
    	
    	function roleById(role_id,role_jurisdictionId){
    		$("#role_name").html(role_id);
    		$("#role_name").hide();
    		document.getElementsByName("qianxian").checked=false;
    		document.getElementById("jurisdiction"+role_jurisdictionId).checked=true;
    		var jurisdiction = $("#jurisdiction"+role_jurisdictionId).val();
    		$("#jurisdiction_id").html(jurisdiction);
    	}
    	function updateRole(){
    		
    		var role_id = $("#role_name").html();
    		if(role_id == "" || role_id == null){
    			alert("请选择角色");
    			return;
    		}
    		if(role_id == 1){
    			alert("管理员不能被编辑");
    			return;
    		}
    		
    		
    		var jurisdiction_id = $("#jurisdiction_id").html();
    		if(jurisdiction_id == "" || jurisdiction_id == null){
    			alert("请选择权限");
    			return;
    		}
    		
    		$.ajax({
    			type:"get",
    			data:"role_id="+role_id+"&role_jurisdictionId="+jurisdiction_id,
    			url:"<%=basePath %>role/update.action",
    			success:function(data){
    				alert(data);
    			},
    			error:function(e){
    				alert("保存失败");
    			}
    			
    		});
    	}
    	
    	function saveRole(){
    		var role_name = $("#role_newName").val();
    		if(role_name == null || role_name == ""){
    			alert("角色名称不能为空");
    			return;
    		}
    		var role_remarks = $("#role_remarks").val();
    		$.ajax({
    			type:"get",
    			data:"role_name="+role_name+"&role_remarks="+role_remarks,
    			url:"<%=basePath %>role/save.action",
    			success:function(data){
    				alert(data);
    				location.href="<%=basePath %>role/page.action";
    			},
    			error:function(e){
    				alert("新失败");
    			}
    			
    		});
    	}
    	
    	function updatePage(role_id){
    		$.ajax({
    			type:"get",
    			data:"role_id="+role_id,
    			url:"<%=basePath %>role/findById.action",
    			success:function(data){
    				if(data != "发生未知错误请重新刷新页面！"){
    					var lists=eval("("+data+")");
    					
    					$("#detailsName").val(lists[0].role_name);
    		    		$("#role_remarksa").val(lists[0].role_remarks);
    				}else{
    					alert(data);
    				}
    				
    			},
    			error:function(e){
    				alert("发生未知错误请重新刷新页面！");
    			}
    			
    		});
    	}
    	
    	function updateRoles(){
    		
    		var role_id = $("#role_name").html();
    		if(role_id == "" || role_id == null){
    			alert("请选择角色");
    			return;
    		}
    		if(role_id == 1){
    			alert("管理员不能被编辑");
    			return;
    		}
    		
    		var role_name = $("#detailsName").val();
    		if(role_name == "" || role_name == null){
    			alert("角色名称不能为空");
    			return;
    		}
    		
    		var role_remarks = $("#role_remarksa").val();
    		
    		$.ajax({
    			type:"get",
    			data:"role_id="+role_id+"&role_name="+role_name+"&role_remarks="+role_remarks,
    			url:"<%=basePath %>role/update.action",
    			success:function(data){
    				alert(data);
    				location.href="<%=basePath %>role/page.action";
    			},
    			error:function(e){
    				alert("修改失败");
    			}
    			
    		});
    	}
    	
    	function deleteById(role_id){
    		$.ajax({
    			type:"get",
    			data:"id="+role_id,
    			url:"<%=basePath %>role/delete.action",
    			success:function(data){
    				if(data == "删除成功"){
    					alert("删除成功");
    					location.href="<%=basePath %>role/page.action";
    				}else{
    					alert("删除失败");
    				}
    					
    				
    			},
    			error:function(e){
    				alert("删除失败");
    			}
    			
    		});
    	}
    	function updateJurisIdHtml(id){
    		$("#jurisdiction_id").html(id);
    	}
    </script>
</html>